<template>
  <el-cascader
    v-model="selectProductCateValue"
    :options="productCateOptions"
    :props="props"
    :placeholder="placeholder"
  >
  </el-cascader>
</template>

<script>
  import waves from '@/directive/waves' // waves directive
  import {productCategoryTree} from "@/api/productCategory"; //

  export default {
    name: 'productCateSelect',
    components: {  },
    directives: { waves },
    filters: {

    },
    props:{
      placeholder: String,
      value: Object
    },
    data() {
      return {
        productCateOptions: [],
        props: {
          value: "id",
          label: "name",
          children: "children"
        }
      }
    },
    computed:{
      //商品的编号
      selectProductCateValue: {
        set(newValue){
          if (newValue && newValue.length === 2) {
            this.value.productCategoryId = newValue[1];
            this.value.productCategoryParentId = newValue[0];
          }else{
            this.value.productCategoryId = newValue[0];
            this.value.productCategoryParentId = undefined;
          }
        },
        get(){
          var select = []
          if(this.value.productCategoryId){
            select.push(this.value.productCategoryParentId)
            select.push(this.value.productCategoryId)
          }
          return select;
        }
      }
    },
    watch: {
    },
    created() {
      this.listFun()
    },
    methods: {
      async listFun(){
        await productCategoryTree({sort: '+id', page: 1, limit: 10000}).then(response => {
          this.productCateOptions = response.data;
        })
      },
    }
  }
</script>

<style lang="scss" scoped>



</style>
